<template>
  <section class="setting-bg pv-12 ph-16">
    <h3>水量余额不足通知</h3>
    <div style="max-width: 400px;justify-content: space-between;" class="flex-row-center">
      <div class="fc-regular">水量不足短信通知</div>
      <el-switch
        v-model="auto"
        inline-prompt
        :active-icon="Check"
        :inactive-icon="Close"
      />
    </div>
    <div class="fs-base fc-regular mt5">（自动在设定的水量不足参数时通知入住人，请保证短信余额充足）</div>
    <div class="mt20">
       <el-radio-group v-model="radio" :disabled="!auto">
        <el-radio label="1" border>不足2吨</el-radio>
        <el-radio label="2" border>不足5度</el-radio>
        <el-radio label="3" border>不足10度</el-radio>
      </el-radio-group>
    </div>
    <el-button style="margin-top: 40px;" type="primary">保存</el-button>
  </section>
</template>
<script setup name="PreElectriNotice">
import { Check, Close, Remove } from '@element-plus/icons-vue'

const auto = ref(false)
const radio = ref('1')
</script>